window.onload=function(){
    var divs=document.querySelectorAll('.item');
    var imgs=document.querySelectorAll('.item img');
    console.log(imgs);
    var btnArr = ['#home','#sscs','#shoppingCar','#mine'];
    var image1=['20170401133604.jpg','20170401133623.jpg','20170401133547.jpg','20170401133615.jpg'];
    var image2=['20170401133610.jpg','20170401133658.jpg','20170401133558.jpg','20170401133635.jpg'];
        imgs[0].src="img/"+image2[0];

    var newUrl=window.location.hash;
    for(var i=0;i<divs.length;i++){
        if(newUrl==btnArr[i]){
          for(var j=0;j<image1.length;j++){
            imgs[j].src="img/"+image1[j];
          }
          imgs[i].src="img/"+image2[i];
          imgs[i].style.animation='bounceIn 1s';
        }
        divs[i].temp=i;
        divs[i].addEventListener('touchstart',function(){
          window.location=btnArr[this.temp];
          for(var i=0;i<image1.length;i++){
            imgs[i].src="img/"+image1[i];
            divs[i].className = '';
          }
          imgs[this.temp].src='img/'+image2[this.temp];
          this.style.animation = '';
          this.className = 'animated bounceIn';
        })
    }
}
